<html class="x-admin-sm">
  <head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.1</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script type="text/javascript" src="./js/cookie.js"></script>
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css"/>
	<script src="layui/layui.js" type="text/javascript" charset="utf-8"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  
  <body>
    <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">演示</a>
        <a>
          <cite>导航元素</cite></a>
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
    </div>
    <div class="x-body">
      <div class="layui-row">
        <form class="layui-form layui-col-md12 x-so">
          <input class="layui-input"  autocomplete="off" placeholder="开始日" name="start" id="start">
          <input class="layui-input"  autocomplete="off" placeholder="截止日" name="end" id="end">
          <input type="text" name="username"  placeholder="请输入用户名" autocomplete="off" class="layui-input">
          <button class="layui-btn"  lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
        </form>
      </div>
      <xblock>
        <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
        <button id="jia" class="layui-btn"><i class="layui-icon"></i>添加</button>
        <span class="x-right" style="line-height:40px">共有数据：88 条</span>
      </xblock>
      <table class="layui-table" id="tab" lay-filter="tfil"></table>
     

    </div>
    
    
    <script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>

</script>

<script>		
		
			layui.use(['table','form','laydate','tree'],function(){
				var table=layui.table,
					form=layui.form,
					$=layui.$,
					tree=layui.tree,
					laydate=layui.laydate;
					
				laydate.render({ 
					  elem: '#addTime'
					  ,type: 'year'
					  ,width:500
					});

				table.render({
					elem:'#tab',
					url:'findM',
					method:'Get',
					page:true,
					toolbar:'#top',
					cols:[[
						{field:'id',title:'ID'},
						{field:'department',title:'系'},
						{field:'specialty',title:'专业'},
						{field:'degree',title:'学历'},
						{title:'操作工具栏',toolbar: '#barDemo',width:400}
						
					]],id:'ttt'
				});
				
				
			   
				/* $(function(){
					$.post('getType',{},function(data){
						var h='';
						for (var i = 0; i < data.length; i++) {
							h+='<option value="'+data[i].tid+'">'+data[i].tname+'</option>';
						}
					
						$("select").append(h);
						form.render('select');
					})
				}) */
				
				active={
					reload:function(){
						table.reload('ttt',{
							where:{
								'vname':$("#name").val(),
								'tid':$("#type1").val(),
								
							}
						})
					}
				}
				
				$("#search").click(function(){
					active.reload();
				});
				//监听添加按钮
				$("#jia").click(function(){
					layer.open({
							type:1,
							title:'添加',
							content:$("#addDiv"),
							area:['550px','600px']
						})
				})
				//添加数据
				$("#addBtn").click(function(){
					$.post('/X-admin/saveM',$("#addForm").serialize(),function(res){
						if(res>0){
							
							layer.closeAll();
							active.reload();
							layer.msg("添加成功！");
						}
					},"json")
				})

				 form.on('submit(test)',function(){
					var data=$("#addForm").serialize();
					
					$.post('video',data,function(res){
						if(res>0){
							active.reload();
							layer.closeAll();
							layer.msg("添加成功！");
						}
					},"json")
					
				}) 
				
				//监听行工具事件
				  table.on('tool(tfil)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
				    var data = obj.data //获得当前行数据
				    ,layEvent = obj.event; //获得 lay-event 对应的值
				    if(layEvent === 'detail'){
				    	form.val("selectForm",data);
				    	layer.open({
							type:1,
							title:'查看',
							content:$("#selectDiv"),
							area:['550px','600px']
						})
				    } else if(layEvent === 'del'){
				    	var id=data.id;
				    	/* $.post('delVideo',{'vid':data.vid},function(res){
							if(res>0){
								active.reload();
								
								layer.msg("删除成功！");
							}
						},"json") */
						$.ajax({          
					       	 url:"/X-admin/deleteM", 
					         dataType:"json",  
					         type:"delete", 
					         data:{"id":id},
					         success:function(data){
					        	 active.reload();
					         },      
					         error:function(){
					        	 
					         }
					});
				
						
						
						
						
						
				    } else if(layEvent === 'edit'){
				    	form.val("updateForm",data);
				    	layer.open({
							type:1,
							title:'修改',
							content:$("#updateDiv"),
							area:['550px','600px']
						})
				    }
				  });
				$("#updateBtn").click(function(){
					
					var data=$("#updateForm").serialize();
				
					alert(data);
					$.ajax({          
				       	 url:"/X-admin/saveM", 
				         dataType:"json",  
				         type:"put", 
				         data:$("#updateForm").serialize(),
				         success:function(data){
				        	 active.reload();
				         },      
				         error:function(){
				        	 
				         }
				});
			
					
					
					
					
				}) 
			
			})
		</script>
   
    
      
      <!--      查看详情 -->
    <div id="selectDiv" style="display: none;margin-left: 10px;">
			<form id="selectForm" class="layui-form" lay-filter="selectForm"  onsubmit="return false;">
				<div class="layui-form-item">
					<label class="layui-form-mid">系别：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="department" />
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-mid">专业：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="specialty" />
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-mid">学历：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="degree" />
					</div>
				</div>
				
		</form>
		</div>
    <!--   添加 -->
      <div id="addDiv" style="display: none;margin-left: 10px;">
			<form id="addForm" class="layui-form" action="" method="post" onsubmit="return false;">
				<div class="layui-form-item">
					<label class="layui-form-mid">系：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="department" />
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-mid">专业：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="specialty" />
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-mid">学历：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="degree" />
					</div>
				</div>
				
				<div class="layui-form-item" style="text-align: center;">
					<button id="addBtn" class="layui-btn" lay-filter="test" >添加</button>
				</div>
			</form>
		</div>
	<!-- 修改 -->
	<div id="updateDiv" style="display: none;margin-left: 10px;">
			<form id="updateForm" class="layui-form" lay-filter="updateForm" onsubmit="return false;">
				<div class="layui-form-item"style="display:none" >
					<label class="layui-form-mid"></label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="id" />
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-mid">系：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="department" />
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-mid">专业：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="specialty" />
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-mid">学历：</label>
					<div class="layui-input-inline" style="width: 350px;">
						<input class="layui-input" name="degree" />
					</div>
				</div>
				<div class="layui-form-item" style="text-align: center;">
					<button id="updateBtn">修改</button>
				</div>
			</form>
		</div>
  </body>

</html>